<template>
    <div class="edu-page-warp">
        <ConditionCard
            shadow="never"
            body-style="padding: 24px 24px 6px 24px;"
            @search="onSubmit"
            @reset="reset('queryForm')"
        >
            <el-form ref="queryForm" :model="queryForm" label-position="right" label-width="120px">
                <el-row :gutter="24" style="height: 50px;">
                    <el-col :span="8">
                        <el-form-item :label="$t('graduationList.graduationYear') + ':'" prop="graduationDate">
                            <!-- <el-select v-model="queryForm.graduationDate" style="width: 100%">
                                <el-option
                                    v-for="item in options.graduationDate"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select> -->
                            <el-date-picker
                                v-model="queryForm.graduationDate"
                                type="year"
                                style="width:100%"
                                value-format="yyyy"
                                :placeholder="$t('graduationList.pleaseSelect')">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('label.college') + ':'" prop="faculty" >
                            <el-select
                                v-model="queryForm.faculty"
                                style="width: 100%;"
                                filterable
                            >
                                <el-option
                                    v-for="item in options.faculty"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>  
                </el-row>
            </el-form>
        </ConditionCard>
        <el-card shadow="never" body-style="padding: 24px;" class="card-margin">
            <h1 class="condition-title">{{ $t('graduationList.completeGraduationApplyList') }}</h1>
            <EduTable
                :data="tableData"
                :total="queryForm.total"
                :order="false"
                :selection="false"
                :pageSize="queryForm.pageSize_"
                :page-num="queryForm.pageNum_"
            >
                <el-table-column :label="$t('graduationList.graduationYear')" prop="graduationDate"></el-table-column>
                <el-table-column :label="$t('label.college')" prop="facultyI18n" show-overflow-tooltip></el-table-column>
                <el-table-column :label="$t('graduationList.conclusionNumber')" prop="isConclusionConformityCount"></el-table-column>
                <el-table-column :label="$t('graduationList.reviewersNumber')" prop="conclusionConformitySunmitCount"></el-table-column>
                <el-table-column :label="$t('graduationList.operating')">
                    <template slot-scope="scope">
                       <el-button type="text" @click="preview(scope.row)" size="mini">
                           {{ $t("graduationList.preview") }}
                        </el-button>
                    </template>
                </el-table-column>
            </EduTable>
        </el-card>
    </div>
</template>
<script>
import bus from "common/src/utils/bus";
import UTILS from "common/src/utils/utils";
import { queryDic, findTrainingLevelByProjId } from "common/src/api/dictionary";
import { findFaculty } from "common/src/api/faculty";
import {findBelongBigProfessionByFaculty} from 'common/src/api/culture/bachelor'
import {findConclusionConformityAuditList} from 'common/src/api/graduationManagement/suspendToGraduateList'
export default {
    name: "graduationApply",
    data() {
        return {
            // 筛选相关选项
            queryForm: {
                isOverseas: "0",
                graduationDate: "", 
                faculty: "", 
                pageNum_: 1,
                pageSize_: 20,
            },

            // 下拉相关选项数据
            options: {
                graduationDate:[],
                faculty: [],    
            },
            tableData: [],
        };
    },

    created() {
        this.init();
    },
    mounted() {

    },
    methods: {
        init() {
            //绑定年级
            // let now = new Date();
            // let currentYear = now.getFullYear()+5,
            //     minYear = currentYear - 16;
            // for (let grade = currentYear; grade > minYear; grade--) {
            //     let obj = { label: grade, value: grade };
            //     this.options.graduationDate.push(obj);
            // }
            this.initOptions();
        },
        initOptions() {
            findFaculty().then(res => { 
                let data = {"X_YX": res.data};
                UTILS.fillSelect({ faculty: "X_YX" }, data, this.options);
                this.queryForm.faculty = this.options.faculty[0].value
                 this.handleSearch();
            });
        },
        handleSearch() {
            findConclusionConformityAuditList(this.queryForm).then(res => {
                if (res.code == 200) {
                    this.tableData = res.data.list;
                    this.queryForm.pageNum_ = res.data.pageNum_;
                    this.queryForm.pageSize_ = res.data.pageSize_;
                    this.queryForm.total = res.data.total_;
                }
            });
        },
        handleCurrentChange(val) {
            this.queryForm.pageNum_ = val.pageNum;
            this.queryForm.pageSize_ = val.pageSize;
            this.handleSearch();
        },

        onSubmit() {
            this.queryForm.pageNum_ = 1
            this.queryForm.pageSize_ = 20
            this.handleSearch();
        },
        reset(ref) {
            this.queryForm.graduationDate = "";
            this.queryForm.pageNum_ = 1
            this.queryForm.pageSize_ = 20
            this.handleSearch();
        },
        preview(row){
            this.$router.push({
                name: '/graduationApplyDetails',
                params: {
                    grade: row.graduationDate,
                    faculty: row.facultyI18n,
                    facultyCode: this.queryForm.faculty,
                }
            })
        }
    }
};
</script>
<style lang="scss" scoped>
.div-main {
    margin-bottom: 16px;
  }
</style>

